import {Component, OnInit} from '@angular/core';
import {_HttpClient} from '@delon/theme';
import {FormBuilder, FormGroup} from '@angular/forms';
import {VideoService} from '../video.service';
import {Videotab} from '../videotab';
import {environment} from '@env/environment';
import {Video} from '../video';
import {NzMessageService} from 'ng-zorro-antd';
import {e} from '@angular/core/src/render3';
import {Location} from '@angular/common';
import {ActivatedRoute} from '@angular/router';

@Component({
    selector: 'app-videoadd',
    templateUrl: './videoadd.component.html',
    styles: [
            `.top {
            margin-bottom: 10px;
        }

        :host ::ng-deep .avatar-uploader,
        :host ::ng-deep .avatar-uploader-trigger,
        :host ::ng-deep .avatar {
            width: 150px;
            height: 150px;
            display: block;
        }

        :host ::ng-deep .avatar-uploader {
            display: block;
            border: 1px dashed #d9d9d9;
            border-radius: 6px;
            cursor: pointer;
        }

        :host ::ng-deep .avatar-uploader-trigger {
            display: table-cell;
            vertical-align: middle;
            font-size: 28px;
            color: #999;
        }

        .save-form-button {
            width: 100%;
        }
        `
    ]
})
export class VideoaddComponent implements OnInit {

    vedioForm: FormGroup;
    vedioTag: Videotab[] = [];

    // 视频 实体
    viedo: Video = {};

    // 视频模态框 是否显示
    isVisible = false;

    // 视频路径
    vedioUrl: string;

    // 视频展示路径
    avaterVedio: string;

    vedioUploadType = 0;


    // 显示图片的完整路径
    avatarUrl: string;

    // 控制器名称
    url_img = 'Upload/';

    // 上传路径
    uploadUrl = environment.SERVER_URL + this.url_img + 'simupload';

    // 图片路径
    imageUrl: string;

    constructor(
        private vedioService: VideoService,
        private fb: FormBuilder,
        private msg: NzMessageService,
        private location: Location,
        private activityRouter: ActivatedRoute,
    ) {

    }

    ngOnInit() {

        this.vedioForm = this.fb.group(
            {
                content: [''],
                title: [''],
                watchnum: [0],
                type: [0],
                vedioType: 0

            }
        );

        this.vedioService.getlaylist(0).subscribe(res => {
            this.vedioTag = res;
            this.vedioForm.patchValue({
                vedioType: this.vedioTag[0]['id'],
            });

        });

        const id = this.activityRouter.snapshot.paramMap.get('id');
        if (id) {
            this.vedioService.getVeid(+id).subscribe(res => {
                this.viedo = res;

                this.vedioForm.patchValue({
                    title: this.viedo['title'],
                    content: this.viedo['content'],
                    watchnum: this.viedo['watchnum'],
                    type: this.viedo['type'],
                    vedioType: this.viedo['layid'],
                });
                this.avatarUrl = environment.SERVER_URL + this.url_img + this.viedo['img'];
                this.imageUrl = this.viedo['img'];
                this.avaterVedio = this.viedo['url'];
            });
        }
    }


    save() {

        const res = this.vedioForm.value;

        this.viedo['title'] = res['title'];
        this.viedo['watchnum'] = res['watchnum'];
        this.viedo['img'] = this.imageUrl;
        this.viedo['content'] = res['content'];
        this.viedo['url'] = this.avaterVedio;
        this.viedo['layid'] = res['vedioType'];
        // console.error(this.vedioForm.value);
        this.vedioService.addVedio(this.viedo).subscribe(res => {
            this.msg.success('保存成功');
            this.location.back();
        }, error1 => {

        });
    }

    showModal() {
        this.isVisible = true;
    }

    handleOk(e) {
        console.log('确定');
        this.isVisible = false;
    }

    handleCancel(e) {
        console.log(e);
        this.isVisible = false;
    }

    handleChange($event) {
        this.imageUrl = $event['file']['response'];
        this.avatarUrl = environment.SERVER_URL + this.url_img + this.imageUrl;
    }

    vedioChange($event) {
        this.vedioUrl = $event['file']['response'];
        this.avaterVedio = environment.SERVER_URL + this.url_img + this.vedioUrl;
    }
}
